import { defineConfig } from 'vite';
import vue from '@vitejs/plugin-vue';
import { resolve } from 'path';
import vueJsx from '@vitejs/plugin-vue-jsx';
import { vitePluginForArco } from '@arco-plugins/vite-vue';
import Components from 'unplugin-vue-components/vite';
import { ArcoResolver } from 'unplugin-vue-components/resolvers';
import AutoImport from 'unplugin-auto-import/vite';

// https://vitejs.dev/config/

export default defineConfig({
  server: {
    proxy: {
      '/v3': {
        target: 'https://restapi.amap.com',
        changeOrigin: true,
        secure: false,
        rewrite: (path) => path.replace(/^\/v3/, '/v3')
      }
    }
  },
  resolve: {
    alias: {
      '@': resolve(__dirname, './src'),
      vue: 'vue/dist/vue.esm-bundler.js'
    }
  },

  plugins: [
    vue(),
    vueJsx(),
    vitePluginForArco({
      // theme: '@arco-themes/vue-digitforce'
      theme: '@arco-themes/vue-linke'
    }),
    AutoImport({
      // targets to transform
      include: [
        /\.[tj]sx?$/, // .ts, .tsx, .js, .jsx
        /\.vue$/,
        /\.vue\?vue/, // .vue
        /\.md$/ // .md
      ],

      dts: 'src/auto-imports.d.ts', // 导入的位置
      // 这里除了引入 vue 以外还可以引入pinia、vue-router、vueuse等，
      // 甚至你还可以使用自定义的配置规则，见 https://github.com/antfu/unplugin-auto-import#configuration
      imports: ['vue', 'vue-router', 'pinia'],
      // eslint报错解决
      eslintrc: {
        enabled: true, // Default `false`
        filepath: './.eslintrc-auto-import.json', // Default `./.eslintrc-auto-import.json`
        globalsPropValue: true // Default `true`, (true | false | 'readonly' | 'readable' | 'writable' | 'writeable')
      },
      // 第三方组件库的解析器
      resolvers: [ArcoResolver()]
    }),
    Components({
      resolvers: [ArcoResolver()],
      // 指定组件位置，默认是src/components
      dirs: ['src/components'],
      // ui库解析器
      // resolvers: [ElementPlusResolver()],
      extensions: ['vue'],
      // 配置文件生成位置
      dts: 'src/components.d.ts'
    })
  ],
  build: {
    sourcemap: true
  },

  css: {
    devSourcemap: true,
    preprocessorOptions: {
      modules: {
        generateScopedName: '[name]_[local]_[hash:5]'
      },
      less: {
        modifyVars: {
          hack: `true; @import (reference) "${resolve(
            'src/assets/style/breakpoint.less'
          )}";`
        },
        javascriptEnabled: true
      }
    }
  }
});
